import { useParams, Navigate } from 'react-router-dom';
import { useLocalStorage } from 'react-use';
import MemoItem from './MemoItem';

function Edit() {
  const { memoId } = useParams();
  const [memoList] = useLocalStorage('memo-list', []);
  
  const currentMemo = memoList?.find(
    (memoItem) => Number(memoItem.id) === Number(memoId)
  );

  if (!memoList) return <div>Loading...</div>;
  if (!currentMemo) return <Navigate to="/" replace />;
  
  return <MemoItem memo={currentMemo} />;
}

export default Edit;
